/*
 * @Author: gk 
 *  用户管理
 * @Date: 2018-03-15 14:44:57 
 * @Last Modified by: txy
 * @Last Modified time: 2019-04-09 16:39:20
 */

layui.config({}).use(['element','zlExcel','zlConfig', 'zlContext', 'zltreemenu', 'zlSelectMultiple', 'zlSelectEx', 'zlpoptree', 'zlSelecttree', 'table', 'layer', 'laydate', 'form', 'zlPinYin', 'upload'], function (exports) {
    var $ = layui.$,
        zlContext = layui.zlContext,
        zltreemenu = layui.zltreemenu,
        layer = layui.layer,
        laydate = layui.laydate,
        table = layui.table,
        form = layui.form,
        upload = layui.upload,
        zlPinYin = layui.zlPinYin,
        zlConfig = layui.zlConfig,
        zlSelecttree = layui.zlSelecttree,
        zlSelectMultiple = layui.zlSelectMultiple,
        statusName = zlConfig.global.result.statusName,
        ERROR = zlConfig.global.result.errorState,
        msgName = zlConfig.global.result.msgName,
        dataName = zlConfig.global.result.dataName,
        OK = zlConfig.global.result.okState,
        fullheight = 'full-30',
        customCurr = 1,
        zlExcel  = layui.zlExcel,
        cols,
        sortcols,
        setsing,
        viewpicture,
        mode = 'listMode';

    form.verify({
        username: function (value, item) { //value：表单的值、item：表单的DOM对象
            if (!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
                return '账户名不能有特殊字符';
            }
            if (/(^\_)|(\__)|(\_+$)/.test(value)) {
                return '账户名首尾不能出现下划线\'_\'';
            }
        }
    });

    var treeObj,
        tableObj,
        fromlayerIndex,
        isloadsearch = false,
        usercount = {},
        isloadTbsearch = false;

    var treeAction = {
        loadTree: function () {
            //创建zTree组件
            treeObj = zltreemenu.render('orgTreeId', {
                dataurl: layui.cache['contentPath'] + '/admin/coreorg/queryorgdepttreelistbyparentid?keyvalue=%' + $("input[name=search]").val() + '%',
                // isMove: false,
                inner: true,
                autoParam: ["RWID"],
                otherParam: {
                    "startflag": "1"
                },
                asyncChildNodes: true,
                flag: 'coreuser',
                dataFilter: function (treeId, parentNode, responseData) {
                    if (responseData[statusName] == OK) {
                        var data = responseData[dataName];
                        if (data && data.length && data.length > 0) {
                            for (var i = 0; i < data.length; i++) {
                                if (data[i].EXPANDPROPERTY == 'org') {
                                    data[i].icon = layui.cache['contentPath'] + '/static/image/org1.png';
                                } else {
                                    data[i].icon = layui.cache['contentPath'] + '/static/image/dept.png';
                                }
                                data[i].iconSkin = 'iconPosition';
                            }
                        }
                        return responseData[dataName];
                    } else {
                        zlContext.errorMsg(responseData[msgName]);
                    }
                    return responseData;
                }
            }, {
                    onClick: function (event, treeId, treeNode) {
                        //触发刷新的事件
                        customCurr = 1;
                        treeAction.raiseResDataEvent(treeNode);
                    },
                    onAsyncSuccess: function (event, treeId, treeNode, msg) {
                        if (!zltreemenu.isloadsearch) {
                            var addTmpNode = function (nodes) {
                                $.each(nodes, function (k, node) {
                                    if (node.EXPANDPROPERTY == "org" || node.EXPANDPROPERTY == "dept") {
                                        var tmpNode = {
                                            RWID: '*',
                                            OBJNAME: '*'
                                        };
                                        treeObj.addNodes(node, 0, tmpNode, true);
                                    }
                                });
                            };
                        }
                        if (zltreemenu.isloadsearch) {
                            treeObj.expandAll(true);
                        }
                        //加载根节点
                        if (!zltreemenu.isloadsearch) {
                            if (treeNode == null) {
                                addTmpNode(treeObj.getNodes());
                            } else {
                                addTmpNode(treeNode.children);
                                treeNode.isParent = treeNode.children.length > 0;
                            }
                        }

                        if ((zltreemenu.isloadsearch || $('#btnTreeSearchInput').val() == '') && !zltreemenu.isExpand) {
                            var firstNode = treeObj.getNodes()[0]
                            if (firstNode) {
                                $('#orgTreeId').find('.noResultBox').remove();
                                treeObj.selectNode(firstNode);
                                layui.event('WM_USERDEF', zlConfig.global.WM_USERDEF.REFRESHDATA_DATA, firstNode);
                            } else {
                                $('#tbUser').siblings('div').find('div.layui-table-fixed').hide();
                                $('#tbUser').siblings('div').find('div.layui-table-main').html('');
                                zlContext.noData($('#tbUser').siblings('div').find('div.layui-table-main'));
                                $('#orgTreeId').append(zltreemenu.noresult)
                            }
                        }
                    },
                    beforeExpand: function (treeId, treeNode) {
                        if (!treeNode.isloaded && !isloadsearch) {
                            zltreemenu.isExpand = true;
                            treeAction.refreshselectnode(treeNode);
                            // treeObj.setting.async.url=layui.cache['contentPath'] + '/admin/coreorg/queryorgdepttreelistbyparentid?resid=252177907A6047E38FC5F1D2E63F15C4';
                            // treeObj.setting.async.otherParam={"startflag":"1"};
                            // treeObj.reAsyncChildNodes(treeNode, "refresh");//异步刷新，清空后加载，加载后打开,需要不打开加参数true  
                            // treeNode['isloaded'] = true;
                            treeNode['isExpandAsyncEvent'] = true;
                            treeNode.isParent = false;
                            return false;
                        } else {
                            treeNode['isExpandAsyncEvent'] = false;
                            return true;
                        }
                    },
                    beforeDrag: function (treeID, treeNodes) {
                        for (var i = 0; i < treeNodes.length; i++) {
                            if (treeNodes[i].EXPANDPROPERTY == 'org') {
                                zlContext.errorMsg('机构节点不能移动！');
                                return false;
                            }
                        }
                    },
                    beforeDrop: function (treeId, treeNodes, targetNode, moveType) {
                        if (targetNode.OBJNAME == '*') {
                            zlContext.errorMsg('不能拖拽到占位节点下!');
                            return false;
                        }
                        // 获取拖拽项的根节点对象
                        var dragNodeRootOrgid = getRootNodeId(treeNodes[0]),
                            targetNodeRootOrgid = getRootNodeId(targetNode);
                        if (targetNode.EXPANDPROPERTY == 'org' || dragNodeRootOrgid != targetNodeRootOrgid) {
                            zlContext.errorMsg('不能跨机构拖拽部门！');
                            return false;
                        }

                        function getRootNodeId(node) {
                            if (node.level == 0) {
                                return node.ORGID;
                            }
                            var pNode = node.getParentNode();
                            if (pNode.level == 0) {
                                return pNode.ORGID;
                            } else {
                                return getRootNodeId(pNode);
                            }
                        }
                    },
                    beforeDragOpen: function (treeId, treeNode) {
                        return false;
                    },
                    onDragMove: function (event, treeId, treeNodes) {
                        if (treeNodes.children) {
                            for (i = 0; i < treeNodes.children.length; i++) {
                                if (treeNodes.children.OBJNAME == "*") {
                                    treeObj.removeNode(treeNodes.children[i]);
                                }
                            }
                        }
                    },
                    onDrop: function (event, treeId, treeNodes, targetNode, moveType) {
                        // 选择一个根节点
                        if (moveType == null) {
                            return;
                        }
                        if (moveType == 'prev' || moveType == 'next') {
                            nodes = treeObj.getSelectedNodes();
                            /*根据 zTree 的唯一标识 tId 快速获取节点 JSON 数据对象*/
                            var targetNode = treeObj.getNodeByTId(nodes[0].parentTId);
                        }
                        var sourcestreenode = treeNodes[0],
                            parentNodeRwid = targetNode.EXPANDPROPERTY == 'org' ? "" : targetNode.RWID,
                            parentsid = sourcestreenode.SYS_PARENTS,
                            isleaf = 0,
                            data = {};
                        if (parentNodeRwid == '') {
                            parentsid = parentsid.substr(parentsid.indexOf(sourcestreenode.RWID), parentsid.length);
                            if (sourcestreenode.children.length == 0 || (sourcestreenode.children.length == 1 && (sourcestreenode.children)[0].RWID == '*')) {
                                isleaf = 1;
                            }
                        } else {
                            parentsid = parentNodeRwid + "_" + parentsid.substr(parentsid.indexOf(sourcestreenode.RWID), parentsid.length);
                        }
                        data = {
                            RWID: sourcestreenode.RWID,
                            SYS_PARENTID: parentNodeRwid,
                            SYS_PARENTS: parentsid,
                            ORGID: sourcestreenode.ORGID,
                            SYS_ISLEAF: isleaf
                        };
                        zlContext.post(layui.cache['contentPath'] + '/admin/bddept/drag', data, function (result) {
                            if (result[statusName] == ERROR) {
                                zlContext.errorMsg(result[msgName]);
                            } else {
                                treeAction.refreshselectnode(targetNode);
                            }
                        })
                    }
                })
        },
        /**发起刷新明细资料的事件 */
        raiseResDataEvent: function (node) {
            var currNode = node;
            if (!node) {
                var nodes = treeObj.getSelectedNodes();
                if (nodes.length > 0) currNode = nodes[0];
            }
            layui.event('WM_USERDEF', zlConfig.global.WM_USERDEF.REFRESHDATA_DATA, currNode);
        },
        /**新增树节点显示*/
        addChildNode: function (pNode, data) {
            var treeNode = treeObj.addNodes(pNode, data);
            treeObj.selectNode(treeNode[0]);
            treeAction.raiseResDataEvent();
        },
        /**更新树的节点显示 */
        refreshNode: function (node, data) {
            $.each(data, function (k, v) {
                if (node[k]) {
                    node[k] = v;
                }
            });
            treeObj.updateNode(node);
            /**刷新页面 */
            treeAction.raiseResDataEvent();
        },
        refreshselectnode: function (treeNode) {
            treeObj.setting.async.url = layui.cache['contentPath'] + '/admin/coreorg/queryorgdepttreelistbyparentid?resId=252177907A6047E38FC5F1D2E63F15C4';
            treeObj.setting.async.otherParam = {
                "startflag": "1"
            };
            treeObj.reAsyncChildNodes(treeNode, "refresh"); //异步刷新，清空后加载，加载后打开,需要不打开加参数true  
            treeNode['isloaded'] = true;
        }
    }
    //加载树
    treeAction.loadTree();

    setsing = [{ field: "ZHANGHM", title: "账户名" }, { field: "SHOUJH", title: "手机号" }]
    var modifycols = function (mode) {
        if (mode == 'listMode') {
            cols = [[ //表头
                {
                    type: 'numbers',
                    fixed: 'left',
                    title: '#'
                }, {
                    type: 'checkbox',
                    fixed: 'left'
                }, {
                    field: 'ZHANGHM',
                    title: '账户名',
                    width: 100,
                    sort: true
                }, {
                    field: 'OBJNAME',
                    title: '姓名',
                    width: 75,
                    sort: true
                }, {
                    field: 'SHOUJH',
                    title: '手机号',
                    width: 100,
                    sort: true
                }, {
                    field: 'YOUX',
                    title: '邮箱',
                    width: 100
                }, {
                    field: 'SYS_SORT',
                    title: '排序',
                    width: 80,
                    sort: true
                }, {
                    field: 'DIZ',
                    title: '地址',
                    width: 80
                }, {
                    field: 'DES',
                    title: '描述',
                    width: 80
                }, {
                    field: 'GONGH',
                    title: '工号',
                    width: 80
                }, {
                    field: 'SHENFZH',
                    title: '身份证',
                    width: 80
                }, {
                    field: 'XINGB',
                    title: '性别',
                    width: 80,
                    templet: '<div><span>{{#  if(d.XINGB==0){ }}  女 {{}} {{#  } else {}}  男 {{#  } }}</span></div>'
                }, {
                    field: 'TOUX',
                    title: '头像',
                    width: 80,
                    templet: function (d) {
                        var toux
                        if (d.TOUX) {
                            toux = d.TOUX
                        } else {
                            toux = '/static/image/userImg.png'
                        }
                        return '<div><img data-id="'+ d.RWID +'"  atl="" src="' + layui.cache['contentPath'] + toux + '" style="width:27px;height:27px"></div>'
                    }
                }, {
                    field: 'ISUSED',
                    title: '用户状态',
                    width: 80,
                    unresize: true,
                    templet: function (d) {
                        return '<input type="checkbox" name="ISUSED" value="' + d.MXZD_YUNXWK + '" disabled lay-skin="switch" lay-text="启用|停用" lay-filter="ISUSED" ' + (d.ISUSED == 1 ? 'checked' : '') + '>';
                    }
                }, {
                    field: 'ISPASSED',
                    title: '审核通过',
                    width: 80,
                    unresize: true,
                    templet: function (d) {
                        return '<input type="checkbox" name="ISPASSED" value="' + d.ISPASSED + '" disabled lay-skin="switch" lay-text="通过|驳回" lay-filter="ISPASSED" ' + (d.ISPASSED == 1 ? 'checked' : '') + '>';
                    }
                }, {
                    field: 'SHIFZB',
                    title: '是否在编',
                    width: 80,
                    templet: '<div><span>{{#  if(d.SHIFZB==0){ }}  否 {{}} {{#  } else {}}  是 {{#  } }}</span></div>'
                }, {
                    field: 'MNGDEPNS',
                    title: '部门',
                    width: 160,
                    sort: true
                }, {
                    field: 'ROLENS',
                    title: '角色',
                    width: 100,
                    sort: true
                }, {
                    fixed: 'right',
                    width: 180,
                    title: '操作',
                    align: 'center',
                    toolbar: '#barUser'
                }
            ]]
        } else if (mode == 'imgListMode') {
            cols = [[ //表头
                {
                    type: 'numbers', title: '#',fixed: 'left'
                }, {
                    type: 'checkbox',fixed: 'left'
                }, {
                    field: 'TOUX',
                    title: '头像',
                    width: 200,
                    templet: function (d) {
                        var toux
                        if (d.TOUX) {
                            toux = d.TOUX
                        } else {
                            toux = '/static/image/userImg.png'
                        }
                        return '<div><img data-id="'+ d.RWID +'"  atl="" src="' + layui.cache['contentPath'] + toux + '" style="width:70px;height:70px"><a style="color:#277FD0;cursor: pointer;">' + d.OBJNAME + '</a></div>'
                    }
                }, {
                    field: 'YOUX',
                    title: '邮箱',
                    width: 100
                }, {
                    field: 'SYS_SORT',
                    title: '排序',
                    width: 80,
                    sort: true
                }, {
                    field: 'DIZ',
                    title: '地址',
                    width: 80
                }, {
                    field: 'DES',
                    title: '描述',
                    width: 80
                }, {
                    field: 'GONGH',
                    title: '工号',
                    width: 80
                }, {
                    field: 'SHENFZH',
                    title: '身份证',
                    width: 80
                }, {
                    field: 'XINGB',
                    title: '性别',
                    width: 80,
                    templet: '<div><span>{{#  if(d.XINGB==0){ }}  女 {{}} {{#  } else {}}  男 {{#  } }}</span></div>'
                }, {
                    field: 'ISUSED',
                    title: '用户状态',
                    width: 80,
                    unresize: true,
                    templet: function (d) {
                        return '<input type="checkbox" name="ISUSED" value="' + d.MXZD_YUNXWK + '" disabled lay-skin="switch" lay-text="启用|停用" lay-filter="ISUSED" ' + (d.ISUSED == 1 ? 'checked' : '') + '>';
                    }
                }, {
                    field: 'ISPASSED',
                    title: '审核通过',
                    width: 80,
                    unresize: true,
                    templet: function (d) {
                        return '<input type="checkbox" name="ISPASSED" value="' + d.ISPASSED + '" disabled lay-skin="switch" lay-text="通过|驳回" lay-filter="ISPASSED" ' + (d.ISPASSED == 1 ? 'checked' : '') + '>';
                    }
                },  {
                    field: 'SHIFZB',
                    title: '是否在编',
                    width: 80,
                    templet: '<div><span>{{#  if(d.SHIFZB==0){ }}  否 {{}} {{#  } else {}}  是 {{#  } }}</span></div>'
                }, {
                    field: 'MNGDEPNS',
                    title: '部门',
                    width: 160,
                    sort: true
                }, {
                    field: 'ROLENS',
                    title: '角色',
                    width: 100,
                    sort: true
                }, {
                    width: 180,
                    title: '操作',
                    align: 'center',
                    toolbar: '#barUser',
                    fixed: 'right'
                }
            ]]
        } else {
            cols = [[ //表头
                {
                    type: 'checkbox',
                    fixed: 'left'
                }, {
                    field: 'ZHANGHM',
                    title: '账户名',
                    width: 100,
                }, {
                    field: 'OBJNAME',
                    title: '姓名',
                    width: 75,
                }, {
                    field: 'SHOUJH',
                    title: '手机号',
                    width: 100,
                }, {
                    type: 'image',
                    field: 'TOUX',
                    title: '头像',
                    width: 80,
                    event: 'viewpicture',
                    templet: function (d) {
                        var toux
                        if (d.TOUX) {
                            toux = d.TOUX
                        } else {
                            toux = '/static/image/userImg.png'
                        }
                        return '<img data-id="'+ d.RWID +'"  atl="" src="' + layui.cache['contentPath'] + toux + '">'
                    }
                }, {
                    field: 'MNGDEPNS',
                    title: '部门',
                    width: 160,
                    templet: function (d) {
                        return '<div class="" style="overflow: hidden;"><a style="float:left;width:50%;text-overflow: ellipsis;overflow: hidden;">部门：' + d.MNGDEPNS + '</a><a style="float:right;width:50%;text-overflow: ellipsis;overflow: hidden;">角色：' + d.ROLENS + '</a></div>'
                    }
                }, {
                    fixed: 'right',
                    width: 180,
                    title: '操作',
                    toolbar: '#barUser'
                }
            ]]
        }
        return cols;
    }
    var tableObj;
    //渲染用户列表
    tableObj = table.render({
        drag:true,
        elem: '#tbUser',
        height: fullheight,
        response: zlConfig.global.gridResponse,
        page: true,
        sortload: true,
        updId: "56C132E7940E4B959E26F211582F16C3",
        updCid:"3D31CFB9B2224C5184F59AEAA8DE6890",
        toolbar: "#toolbarUser",
        defaultToolbar: ['filter'],
        filter:{'cache':true},
        cols: modifycols(mode),
        //sortcols: sortcols,
        setsing: setsing,
        mode: mode,
        vertical:true,
        event: {
            onRowdbClick: function (field, row) {
                gridAction.viewRow(row);
            }
        }
    });


    zlContext.noData($('#tbUser').siblings('div').find('div.layui-table-main'))

    var gridAction = {
        currentEditObj: undefined,
        userGridedit: function (orgNode, row, type, readonly) {
            var readonly = readonly && readonly != 0 ? 'disabled' : '',
                orgid = type == 'edit' ? row['ORGID'] : orgNode.ORGID;
            var frm = [
                '<div class="site-block layui-fluid" lay-filter="divgridUser"> <form id ="frmGridUser" class="layui-form"  action="">'
                , '	<div class="layui-form-item layui-hide">'
                , '		<div class="layui-input-block">'
                , '			<input type="text" name="EDITTYPE" class="layui-input">'
                , '			<input type="text" name="RWID" class="layui-input">'
                , '			<input type="text" name="ORGID" class="layui-input">'
                , '			<input type="text" name="TOUX" class="layui-input">'
                , '			<input type="text" name="MNGDEPIDS" class="layui-input">'
                , '			<input type="text" name="ROLEIDS" class="layui-input">'
                , '			<input type="text" name="ISPASSED" class="layui-input" >'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '		<div class="layui-input-block">'
                , '			<div class="layui-upload">'
                , ' 			<div class="layui-upload-list">'
                , '					<img src="' + layui.cache['contentPath'] + '/static/image/userImg.png" class="layui-upload-img" id="imgPrieviewPic">'
                , '					<p id="demoText"></p>'
                , '				</div>'
                , '	  			<button type="button" class="layui-btn" id="btnUploadfile" ' + readonly + '>上传头像</button>'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">姓名</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="OBJNAME" ' + readonly + ' lay-verify="required|name" maxlength="32" placeholder="请输入中文姓名"  class="layui-input" autocomplete="off">'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">账户名</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="ZHANGHM" ' + readonly + ' lay-verify="required|username" placeholder="请输入账户名" maxlength="16" class="layui-input" autocomplete="off">'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">编号</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="OBJCODE" ' + readonly + ' lay-verify="required" placeholder="请输入编号" maxlength="10" class="layui-input">'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">性别</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="radio" name="XINGB" value="1" title="男" ' + readonly + '>'
                , '				<input type="radio" name="XINGB" value="0" title="女" ' + readonly + '>'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">手机号</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="SHOUJH" ' + readonly + ' lay-verify="required|phone|number" maxlength="11" placeholder="请输入手机号"  class="layui-input">'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">邮箱</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="YOUX" ' + readonly + ' lay-verify="email" autocomplete="off" placeholder="请输入邮箱" maxlength="50" class="layui-input">'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">工号</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="GONGH" ' + readonly + ' placeholder="请输入工号" lay-verify="number" maxlength="32" class="layui-input">'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">身份证</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" name="SHENFZH" ' + readonly + ' lay-verify="identity" placeholder="请输入身份证" maxlength="18" class="layui-input">'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">出生年月日</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" class="layui-input" name="CHUSRQ"' + readonly + ' readonly="readonly" placeholder="yyyy-MM-dd" lay-verify="date">'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">籍贯</label>'
                , '			<div class="layui-input-block">'
                , ' 			<div name="JIG_ID" zlcomponent ' + readonly + ' class="layui-form-select zlpoptree" settings="{ischeckleaf:true,multselect:false,method:\'GET\' ,placeholder:\'请选择籍贯\',id:\'DCMX_KEY\',idKey:\'DCMX_KEY\',pIdKey:\'SYS_PARENTID\',name:\'VALUE\',dataurl:\'' + layui.cache['contentPath'] + '/manager/coredictionary/querydictionarybyid?RWID=317D2C269FBA41BC8946F8F431745ADC' + '\',formtitle:\'选择籍贯\'}"></div>'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">民族</label>'
                , '			<div class="layui-input-block">'
                , '		  		<select name="MINZ_ID" ' + readonly + ' zlcomponent class="select-ext" settings="{titlefield: \'VALUE\', valuefield: \'DCMX_KEY\',dataurl:\'' + layui.cache['contentPath'] + '/manager/coredictionary/querydictionarybyid?RWID=9B232442111F498DBEEF7E70530B2202' + '\'}">'
                , '		  		</select>'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">参加工作</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" class="layui-input" name="CANJGZRQ"' + readonly + ' readonly="readonly" placeholder="yyyy-MM" lay-verify="date">'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">政治面貌</label>'
                , '			<div class="layui-input-block">'
                , '		  		<select name="ZHENGZMM_ID" ' + readonly + ' zlcomponent class="select-ext" settings="{titlefield: \'VALUE\', valuefield: \'DCMX_KEY\',dataurl:\'' + layui.cache['contentPath'] + '/manager/coredictionary/querydictionarybyid?RWID=E5FADBE1450C49759CC71A1CFD94AE60' + '\'}">'
                , '		  		</select>'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">学历</label>'
                , '			<div class="layui-input-block">'
                , '		  		<select name="XUEL_ID" ' + readonly + ' zlcomponent class="select-ext" settings="{titlefield: \'VALUE\', valuefield: \'DCMX_KEY\',dataurl:\'' + layui.cache['contentPath'] + '/manager/coredictionary/querydictionarybyid?RWID=F72C50108DBD41BBB6223FE82E0F4915' + '\'}">'
                , '		  		</select>'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">毕业院校</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" class="layui-input" maxlength="16" placeholder="请输入毕业院校" name="BIYYX"' + readonly + '>'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">专业</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" class="layui-input" maxlength="16" placeholder="请输入专业" name="ZHUANY"' + readonly + '>'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">紧急联系人</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" class="layui-input" maxlength="32" lay-verify="name" placeholder="请输入紧急联系人" name="JINJLXR"' + readonly + '>'
                , '			</div>'
                , '		</div>'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">联系人手机号</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="text" class="layui-input" placeholder="请输入联系人手机号" name="JINJLXRSJH"' + readonly + ' lay-verify="phone|number" maxlength="11">', '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '		<label class="layui-form-label">所属角色</label>'
                , '			<div class="layui-input-block w508">'
                , '		  		<div name="ROLEIDS" zlcomponent class="layui-form-select select-multiple" ' + readonly + ' lay-verify="required" settings="{showtool:false,issearch:\'on\',edittype:\'' + readonly + '\', placeholder:\'请选择角色\', titlefield: \'OBJNAME\', valuefield: \'RWID\',dataurl:\'' + layui.cache['contentPath'] + '/core/role/queryrolelist?orgId=' + orgid + '\'}">'
                , '		  		</div>'
                , '			</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '			<label class="layui-form-label">监管部门</label>'
                , '			<div class="layui-input-block w508">'
                , '	  			<div name="JIANGBM" zlcomponent class="layui-form-select select-tree" ' + readonly + ' settings="{Multiple:true,chkboxType:\'{ Y: &quot;&quot;, N: &quot;&quot; }\', placeholder:\'请选择部门\', name: \'OBJNAME\', idKey: \'RWID\', pIdKey: \'SYS_PARENTID\', rootPid: null, method:\'post\',params:\'{ORGID:&quot;' + orgNode.ORGID + '&quot;}\' ,dataurl:\'' + layui.cache['contentPath'] + '/admin/bddept/queryuse\'}"></div>'
                , '			</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '			<label class="layui-form-label">所属部门</label>'
                , '			<div class="layui-input-block w508">'
                , '	  			<div name="MNGDEPIDS" zlcomponent class="layui-form-select select-tree" ' + readonly + ' lay-verify="required" settings="{ Multiple:true,chkboxType:\'{ Y: &quot;&quot;, N: &quot;&quot; }\', placeholder:\'请选择部门\', name: \'OBJNAME\', idKey: \'RWID\', pIdKey: \'SYS_PARENTID\', rootPid: null, method:\'post\',params:\'{ORGID:&quot;' + orgNode.ORGID + '&quot;}\' ,dataurl:\'' + layui.cache['contentPath'] + '/admin/bddept/queryuse\'}"></div>'
                , '			</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '			<label class="layui-form-label">是否在编</label>'
                , '			<div class="layui-input-block">'
                , '	  			<input type="radio" name="SHIFZB" value="1" title="是" ' + readonly + '>'
                , '				<input type="radio" name="SHIFZB" value="0" title="否" ' + readonly + '>'
                , '			</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '		<label class="layui-form-label">家庭地址</label>'
                , '		<div class="layui-input-block w508">'
                , '			<textarea placeholder="请输入地址" name="DIZ" maxlength="33" class="layui-textarea" ' + readonly + '></textarea>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '		<label class="layui-form-label">描述</label>'
                , '		<div class="layui-input-block w508">'
                , '			<textarea placeholder="请输入描述" name="DES" maxlength="16" class="layui-textarea" ' + readonly + '></textarea>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , '		<label class="layui-form-label">排序</label>'
                , '		<div class="layui-input-block w508">'
                , '			<input type="text" name="SYS_SORT" lay-verify="required|number" maxlength="7" placeholder="请输入排序 " ' + readonly + '  class="layui-input">'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item">'
                , ' 	<div class="layui-inline">'
                , '			<label class="layui-form-label">用户状态</label>'
                , '			<div class="layui-input-block">'
                , '				<input type="checkbox" name="ISUSED" valueformat="1|0" lay-text="启用|停用" lay-skin="switch" ' + readonly + '>'
                , '			</div>'
                , '		</div>'
                , '	</div>'
                , '	<div class="layui-form-item' + (readonly == 'disabled' ? ' layui-hide"' : '"') + '>'
                , '		<div class="layui-input-block">'
                , '		  <button class="layui-btn" lay-submit lay-filter="frmGridUser">保存</button>'
                , '		</div>'
                , '	</div>'
                , '</form></div>'
            ];
            layer.open({
                type: 1,
                limit: 999,
                maxmin: true, //最大化按钮
                title: readonly == 'disabled' ? '查看' : (type == 'edit' ? '用户编辑' : '用户新增'),
                id: 'coreuserLayer',
                area: ['100%', '100%'],
                content: frm.join(''),
                success: function (layero, index) {
                    laydate.render({
                        elem: $('input[name="CHUSRQ"]')[0] //指定元素
                    });
                    laydate.render({
                        elem: $('input[name="CANJGZRQ"]')[0], //指定元素
                        type: 'month'
                    });

                    var uploadInst = upload.render({
                        elem: '#btnUploadfile',
                        accept: 'file', //所有的文件
                        acceptMime: 'image/*',
                        url: layui.cache['contentPath'] + '/admin/coreuser/upload/',
                        // before: function (obj) {},
                        done: function (res) {
                            if (res[statusName] != OK) {
                                $('#imgPrieviewPic').attr('src', '');
                                return layer.msg('上传失败' + res[msgName]);
                            } else {
                                $(res[dataName]).each(function (index, obj) {
                                    $('#imgPrieviewPic').attr('src', layui.cache['contentPath'] + obj["newFileName"]);
                                    $('#frmGridUser input[name=TOUX]').val(obj["newFileName"]);
                                });
                            }
                        },
                        error: function () {
                            layer.msg('上传失败');
                        }
                    });

                    if (type == 'edit') {
                        zlContext.autoFill($('#frmGridUser'), row);
                        if (row['TOUX'] !== '') {
                            $('#frmGridUser input[name=TOUX]').val(row['TOUX']);
                            $('#imgPrieviewPic').attr('src', layui.cache['contentPath'] + $('#frmGridUser input[name=TOUX]').val());
                        }
                        $('#frmGridUser input[name=EDITTYPE]').val('edit');
                        $('#frmGridUser input[name=ORGID]').val(row['ORGID']);
                        $('#frmGridUser input[name=RWID]').val(row['RWID']);
                    } else {
                        $('#frmGridUser input[name=XINGB][value=1]').prop("checked", true);
                        $('#frmGridUser input[name=ISUSED]').prop("checked", true);
                        $('#frmGridUser input[name=SHIFZB][value=1]').prop("checked", true);

                        form.render();
                        /**设置隐藏属性*/
                        $('#frmGridUser input[name=EDITTYPE]').val('new');
                        $('#frmGridUser input[name=ORGID]').val(orgNode.ORGID);
                        $('#frmGridUser input[name=ISPASSED]').val('1');
                        $('#frmGridUser input[name=SYS_SORT]').val(usercount[orgNode.ORGID] + 1);

                        if (zlContext.browserType() == 'IE') {
                            zlpoptree.render($('div[name=JIG_ID]'));
                            zlSelectMultiple.render($('div[name=ROLEIDS]'));
                            zlSelecttree.render($('div[name=JIANGBM]'));
                            zlSelecttree.render($('div[name=MNGDEPIDS]'));
                        } else {
                            zlSelecttree.setValue($('div[name=MNGDEPIDS]'), orgNode.RWID);
                        }

                        $('#frmGridUser input[name=OBJNAME]').change(function () {
                            var v = $('#frmGridUser input[name=OBJNAME]').val();
                            /**部门名 */
                            var v1 = zlPinYin.C(v);
                            $('#frmGridUser input[name=ZHANGHM]').val(v1);
                            $('#frmGridUser input[name=OBJCODE]').val(v1);
                        });
                    }

                    if (readonly == 'disabled') {
                        $('[placeholder]').attr('placeholder', '');
                        $('#btnUploadfile').hide()
                    }
                    fromlayerIndex = index;
                },
                cancel: function (index, layero) {
                    if (type == 'edit' && readonly != 'disabled') {
                        zlContext.isFormDataChange('frmGridUser', gridAction.currentEditObj.data, gridAction, index);
                        return false;
                    }
                }
            });
        },
        viewRow: function (row) {
            var nodes = treeObj.getSelectedNodes();
            if (nodes.length == 0) {
                zlContext.warnMsg('请选择部门节点');
                return;
            }
            gridAction.userGridedit(nodes[0], row, 'edit', true);
        },
        newRow: function () {
            var nodes = treeObj.getSelectedNodes();
            if (nodes.length == 0) {
                zlContext.warnMsg('请选择部门节点');
                return;
            }
            if (nodes[0].EXPANDPROPERTY == 'org') {
                zlContext.warnMsg('无法在机构下新增用户,请选择机构下的部门新增用户');
                return;
            }
            gridAction.userGridedit(nodes[0], null, 'new');
        },
        editRow: function (row) {
            var nodes = treeObj.getSelectedNodes();
            if (nodes.length == 0) {
                zlContext.warnMsg('请选择部门节点');
                return;
            }
            gridAction.userGridedit(nodes[0], row, 'edit');
        },
        deleteRows: function (rows) {
            if (rows.length == 0) {
                zlContext.warnMsg('请选择需要删除的用户');
                return;
            }
            zlContext.confirm('询问', '是否要删除选择的用户?', function (index) {
                var ids = [];
                var orgId = treeObj.getSelectedNodes()[0].ORGID;
                rows.forEach(function (v) {
                    ids.push(v.data ? v.data['RWID'] : v['RWID']);
                    
                });
                //提交删除
                zlContext.deletePost(layui.cache['contentPath'] + '/admin/coreuser/remove', {
                    ids: ids,orgid:orgId
                }, function (result) {
                    if (result[statusName] == OK) {
                        if (rows[0].del) {
                            rows[0].del();
                            usercount[orgId] = usercount[orgId] - 1;
                        } else {
                            gridAction.refreshGrid('del', null);
                            usercount[orgId] = usercount[orgId] - rows.length;
                        }
                        var currCount = $('div.layui-table-view').find('span.layui-laypage-count').html().replace(/[^0-9]/ig, ""),
                            afterDelNum = parseInt(currCount) - rows.length + '';
                        $('div.layui-table-view').find('span.layui-laypage-count').html('共 ' + afterDelNum + ' 条');
                        zlContext.successMsg('删除成功');
                    } else {
                        zlContext.errorMsg(result[msgName]);
                    }
                });
                layer.close(index);
            });
        },
        sumbit: function (fields) {
            var editType = $('#frmGridUser input[name=EDITTYPE]').val();
            if (editType == 'new') {
                if (fields.TOUX == '') {
                    fields.TOUX = '/static/image/userImg.png';
                }
                zlContext.put(layui.cache['contentPath'] + '/admin/coreuser/add', fields, function (result) {
                    if (result[statusName] == OK) {
                        gridAction.refreshGrid(editType, result[dataName]);
                        layer.close(fromlayerIndex);
                        zlContext.successMsg('保存成功');
                        usercount[fields.ORGID] = usercount[fields.ORGID] + 1;
                        return true;
                    } else {
                        zlContext.errorMsg(result[msgName]);
                    }
                });
            }
            if (editType == 'edit') {
                zlContext.post(layui.cache['contentPath'] + '/admin/coreuser/modify', fields, function (result) {
                    if (result[statusName] == OK) {
                        gridAction.refreshGrid(editType, fields);

                        layer.close(fromlayerIndex);
                        zlContext.successMsg('保存成功');
                        return true;
                    } else {
                        zlContext.errorMsg(result[msgName]);
                    }
                });
            }
            return false;
        },
        search: function () {
            var nodes = treeObj.getSelectedNodes();
            if (nodes.length > 0) {
                customCurr = 1;
                layui.event('WM_USERDEF',
                    zlConfig.global.WM_USERDEF.REFRESHDATA_DATA, nodes[0]);
            }
        },
        refreshGrid: function (type, row) {
            /**刷新行 */
            if (type == 'edit' && gridAction.currentEditObj) {
                gridAction.currentEditObj.update(row);
                if(row.TOUX){
                    $('[data-field="TOUX"]').find('img[data-id="'+ row.RWID +'"]').attr('src', layui.cache['contentPath'] + row.TOUX);
                }
                
            } else if (type == 'new') {
                // tableObj.reload('tbUser');
                $('#edtSeacherValue').val('');
                $('.zl-container').attr('data-search', '')
                gridAction.search();
            } else if (type == 'del') {
                table.deleteCheckRows('tbUser');
            }
            form.render();
        },
        repass: function (data) {
            if (data.length == 0) {
                zlContext.warnMsg('请选择需要重置密码的用户');
                return;
            }
            var ids = new Array();
            data.forEach(function (i, item) {
                var entity = {};
                entity.RWID = i.RWID;
                entity.ORGID = i.ORGID
                ids.push(entity);
            });
            zlContext.confirm('询问', '是否要重置选择的用户密码?', function (index) {
                zlContext.post(layui.cache['contentPath'] + '/admin/coreuser/resetPw', ids, function (result) {
                    if (result[statusName] == OK) {
                        zlContext.successMsg('用户密码重置成功!');
                    } else {
                        zlContext.errorMsg(result[msgName]);
                    }
                });
                layer.close(index);
            });
        },
        modifyUserBm: function (data) {
            if (data.length == 0) {
                zlContext.warnMsg('请选择需要修改部门的用户');
                return;
            }
            var nodes = treeObj.getSelectedNodes()
                , selDept
                , selDeptName
                , selOrg
                , ids = []
                , deptid = []
                , deptName = [];

            if (nodes[0].EXPANDPROPERTY == 'org') {
                selDept = '';
                selDeptName = '';
                selOrg = nodes[0].RWID;
            } else {
                selDept = nodes[0].RWID
                selOrg = nodes[0].ORGID;
                selDeptName = nodes[0].OBJNAME;
            }

            data.forEach(function (v) {
                ids.push(v.data ? v.data['RWID'] : v['RWID']);
                deptid.push(v.MNGDEPIDS);
                deptName.push(v.MNGDEPNS);
            });
            var usesetting = {
                formtitle: "修改部门",
                view: {
                    showLine: true
                },
                async: {
                    enable: true,
                    url: layui.cache['contentPath'] + "/admin/bddept/queryuse",
                    type: "post",
                    otherParam: { ORGID: selOrg },
                    dataFilter: function (treeId, parentNode, responseData) {
                        if (responseData[statusName] == OK) {
                            return responseData[dataName];
                        } else {
                            zlContext.errorMsg(responseData[msgName]);
                        }
                        return responseData;
                    },
                },
                data: {
                    key: {
                        name: "OBJNAME"
                    }
                    , simpleData: {
                        enable: true
                        , idKey: "RWID"
                        , pIdKey: "SYS_PARENTID"
                        , rootPid: ""
                    }
                },
                check: {
                    enable: false,
                    chkboxType: { "Y": "ps", "N": "s" },
                    chkStyle: "checkbox",
                },
                selectcallback: function (newdata) {
                    var params = {};
                    params.ORGID = selOrg;
                    params.DEPTID = selDept;
                    params.SELDEPTNAME = selDeptName;
                    params.USERID = ids.join(',');
                    params.OLDDEPTID = deptid.join('&');
                    params.OLDDEPTNAME = deptName.join('&');
                    params.NEWDEPTID = newdata[0].RWID;
                    params.NEWDEPTNAME = newdata[0].OBJNAME;
                    zlContext.post(layui.cache['contentPath'] + "/admin/coreuser/modifydept", params, function (data) {
                        if (data.state == OK) {
                            zlContext.successMsg("修改用户部门成功！");
                            tableObj.reload('tbUser');
                        } else {
                            zlContext.errorMsg(data.msg);
                        }
                    }
                    );

                }
            };
            zlpoptree.clickShow(usesetting);
        }
    }

    $('.zl-container').on('keyup', '#edtSeacherValue', function (event) {
        var keyCode = event.keyCode;
        customCurr = 1;
        $('.zl-container').attr('data-search', $(this).val())
        if (keyCode == 13) {
            gridAction.search();
        }
        if ((keyCode == '46' || keyCode == '8' || (event.ctrlKey && keyCode == '86')) && $(this).val() == '' && isloadTbsearch) {
            $('#btnSeacher').trigger('click');
            isloadTbsearch = false;
        }
    });


    //头工具栏事件
    table.on('toolbar(tbUser)', function (obj) {
        var checkStatus = table.checkStatus(obj.config.id);
        switch (obj.event) {
            case 'btnSeacher':
                customCurr = 1;
                gridAction.search();
                break;
            case 'addUser':
                gridAction.newRow();
                break;
            case 'deleteUser':
                var rows = checkStatus.data;
                gridAction.deleteRows(rows);
                break;
            case 'modifyUserBm':
                var rows = checkStatus.data;
                gridAction.modifyUserBm(rows);
                break;
            case 'repass':
                var rows = checkStatus.data;
                gridAction.repass(rows);
                break;
            case 'listMode':
            case 'imgListMode':
            case 'cardListMode':
                mode = $('.mode-btn[lay-event="' + obj.event + '"]').attr("lay-event");
                tableObj.reload({
                    mode: mode,
                    cols: modifycols(mode)
                });
                var nodes = treeObj.getSelectedNodes();
                if (nodes.length > 0)
                    currNode = nodes[0];
                layui.event('WM_USERDEF', zlConfig.global.WM_USERDEF.REFRESHDATA_DATA, currNode);
                break;
            case 'daoc':
                var params= {};
                params.tableid='tbUser';
                // params.sql = "select * from core_user where orgid=&apos;${cxt.getUserOrgId()}&apos;";
                zlExcel.excelpopform(params);
                break;
            case 'outportmodel':
                location.href=layui.cache['contentPath']+'/static/appdata/filesres/excelTemplate/CoreuserImportModel.xls';
                break;
        };
    });
    //监听行工具事件
    table.on('tool(tbUser)', function (obj) {
        var row = obj.data; //获得当前行数据
        var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        if (row.CHUSRQ) {
            row.CHUSRQ = row.CHUSRQ ? row.CHUSRQ.split(' ')[0] : '';
        }
        if (layEvent === 'detail') { //查看
            gridAction.viewRow(row);
        } else if (layEvent === 'del') { //删除
            gridAction.currentEditObj = obj;
            gridAction.deleteRows([obj]);
        } else if (layEvent === 'edit') { //编辑
            gridAction.currentEditObj = obj;
            gridAction.editRow(row);
        } else if (layEvent === 'viewpicture') {
            layer.open({
                type: 1,
                title: '查看图片',
                area: ['500px', '450px'],
                shadeClose: true,
                content: viewpicture(row.TOUX)
            });

        }

    });
    //提交
    form.on('submit(frmGridUser)', function (frm) {
        if ($(frm.elem).hasClass('getField')) {
            gridAction.newFields = frm.field;
            return false;
        }
        return gridAction.sumbit(frm.field);
    });

    //监听刷新的事件
    layui.event('WM_USERDEF', zlConfig.global.WM_USERDEF.REFRESHDATA_DATA, null, function (node) {
        var index = layer.msg('数据查询中，请稍候...', {
            icon: 16,
            time: false,
            shade: 0.1
        });
        var loadGridData = function (id, url, param) {
            tableObj.reload({
                url: url,
                method: 'post',
                where: param,
                page: {
                    curr: customCurr
                },
                done: function (res, curr, count) {
                    if (node.EXPANDPROPERTY == 'org') {
                        usercount[node.RWID] = res.obj.length;
                    }
                    $('#edtSeacherValue').val($('.zl-container').attr('data-search'))
                    layer.close(index);
                    customCurr = curr;
                    upload.render({
                        elem: '#btnImport',
                        accept: 'file', //所有的文件
                        url: layui.cache['contentPath'] + '/core/excel/excelin',
                        done: function (res) {
                            if (res[statusName] != OK) {
                                // $('#imgPrieviewPic').attr('src', '');
                                return zlContext.errorMsg('导入失败:' + res[msgName]);
                            } else {
                                zlContext.successMsg('导入成功');
                                gridAction.refreshGrid('new',null);
                            }
                        },
                        error: function () {
                            zlContext.errorMsg('上传失败');
                        }
                    });
                }
            }, true);
        }

        var params = node.EXPANDPROPERTY == 'org' ? {
            ORGID: node.RWID
        } : {
                MNGDEPIDS: '%' + node.RWID + '%'
            };
        if ($('#edtSeacherValue').val() !== '') {
            params['OBJNAME'] = $('#edtSeacherValue').val();
            isloadTbsearch = true;
        }
        params['ISPASSED'] = 1;
        loadGridData('tbUser', layui.cache['contentPath'] + '/admin/coreuser/query', params);
    });

    //iframe自适应
    $(window).on('resize', function () {
        zlContext.setMaxHeihgt(0);
    }).resize();

    function viewpicture(imgsrc) {
        var pictureStr = [
            '<div class="viewpicture layui-fluid" style="text-align:center;line-height:397px; height:379px">'
            , '     <img src="' + layui.cache['contentPath'] + imgsrc + '"  style="max-width:100%;vertical-align: middle;">'
            , '</div>'
        ];
        return pictureStr.join('');
    }



});